let now_page = 1
let max_page
let change_num
let del_num
    /* 动态渲染 */
function showTable(data) {
    $('#table_rk tbody').html('')
    for (let i = 0; i < data.length; i++) {
        $('#table_rk tbody').append(
            `<tr>
                <td>${data[i].bh}</td>
                <td>${data[i].spmc}</td>
                <td>${data[i].spfl}</td>
                <td>${data[i].rksl}</td>
                <td>${data[i].rkrq}</td>
                <td>
                    <button data-toggle="modal" data-target="#change_rk" onclick='change_rk(${i})'><span class="glyphicon glyphicon-edit"></span>编辑</button>
                </td> 
                <td>
                    <button data-toggle="modal" data-target="#TF_box" onclick='del_rk(${i})'><span class="glyphicon glyphicon-trash"></span>删除</button>
                </td>    
            </tr>`
        )
    }
}
/* 数据分页 */
function page_turn(num, data) {
    let page_one = (num - 1) * 10
    let page_data = data.slice(page_one, page_one + 10)
    now_page = num
    showTable(page_data)
    pageStyle(num)
}
/* 生成并绑定分页按钮 */
function showPage(data) {
    $('#page_rkgl').html('')
    max_page = Math.ceil(data.length / 10)
    for (let i = 1; i <= max_page; i++) {
        $('#page_rkgl').append(`<div class='page_style'>${i}</div>`)
    }
    if (max_page > 1) {
        $('#page_rkgl div:first-of-type').before(`<div class='page_style' onclick='page_pre()'> < </div>`)
        $('#page_rkgl div:last-of-type').after(`<div class='page_style' onclick='page_next()'> > </div>`)
    }
}
/* 设置点击页面的class样式效果 */
function pageStyle(num) {
    $('.page_style').removeClass("T_page")
    $('.page_style').eq(num).addClass("T_page")
}
/* 为方便后面重复刷新渲染的函数 */
function show(num) {
    page_turn(num, allData)
    showPage(allData)
    pageStyle(num)
}
/* 上一页 */
function page_pre() {
    if (now_page > 1) {
        now_page--
        show(now_page)
        return
    }
    show(now_page)
}
/* 下一页 */
function page_next() {
    if (now_page < max_page) {
        now_page++
        show(now_page)
        return
    }
    show(now_page)
}
/* 点击切换 入库管理 与 商品入库 时，显示内容的切换和按钮的样式改变*/
function menu_rkgl() {
    $('.add_rk').removeClass("T_nav")
    $('.menu_rk').addClass("T_nav")
    $('#add_rkgl').addClass("display")
    $('#table_rk').removeClass("display")
    $('#page_rkgl').removeClass("display")
}
/* 添加商品入库函数 */
function menu_sprk() {
    $('.menu_rk').removeClass("T_nav")
    $('.add_rk').addClass("T_nav")
    $('#add_rkgl').removeClass("display")
    $('#table_rk').addClass("display")
    $('#page_rkgl').addClass("display")
    showSelect_add(allData)
}
/* 点击添加时，相对应模态框的内容 */
function add_rk() {
    $('#box_header').html('<h4><span class="glyphicon glyphicon-exclamation-sign"></span>是否确定添加该条的该条数据？</h4>')
    $('#box_footer').html(`<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
    <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="T_add_rk()">确认</button>`)
}
/* 确定添加后，匹配添加数据，补齐对应其他数据信息，加入数组，并重新渲染页面 */
function T_add_rk() {
    let spfl = document.getElementById('add_rk_1').value
    let spmc = document.getElementById('add_rk_2').value
    let yjsl = document.getElementById('add_rk_3').value
    let bz = document.getElementById('add_rk_4').value
    let flbh
    let flmc
    let flms
    let kcbh
    let spsl
    let bh
    let rksl
    let rkrq
    let cksl
    let ckrq
    let yhm
    let xm
    let xb
    for (let i = 0; i < allData.length; i++) {
        if (spmc == allData[i].spmc) {
            flbh = allData[i].flbh
            flmc = allData[i].flmc
            flms = allData[i].flms
            kcbh = allData[i].kcbh
            spsl = allData[i].spsl
            bh = allData[i].bh
            rksl = allData[i].rksl
            rkrq = allData[i].rksl
            cksl = allData[i].cksl
            ckrq = allData[i].ckrq
            yhm = allData[i].yhm
            xm = allData[i].xm
            xb = allData[i].xb
            break;
        }
    }
    let new_data = { flbh, flmc, flms, bz, kcbh, spmc, spfl, spsl, bh, rksl, rkrq, yjsl, cksl, ckrq, yhm, xm, xb }
    allData.splice(0, 0, new_data)
    show(now_page)
}
/* 点击删除时，相对应的模态框内容，并记录对应数组中的下标位置 */
function del_rk(num) {
    del_num = num + (now_page - 1) * 10
    $('#box_header').html('<h4><span class="glyphicon glyphicon-exclamation-sign"></span>是否确定删除编号为<span>' + allData[num].bh + '</span>的<span>' + allData[num].spmc + '</span>数据信息？</h4>')
    $('#box_footer').html(`<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
    <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="T_del_rk()">确认</button>`)
}
/* 确认删除后，删除数组中对应下标数据，并重新渲染页面 */
function T_del_rk() {
    allData.splice(del_num, 1)
    show(now_page)
}
/* 点击修改时，记录对应数组的下标位置，读取对应数据的内容，添加入模态框对应框内 */
function change_rk(num) {
    showSelect_change(allData)
    change_num = num + (now_page - 1) * 10
    let change_obj = allData[change_num]
    let spfl = document.getElementById('change_rk_1')
    let spmc = document.getElementById('change_rk_2')
    let yjsl = document.getElementById('change_rk_3')
    let bz = document.getElementById('change_rk_4')
    spfl.value = change_obj.spfl
    spmc.value = change_obj.spmc
    yjsl.value = change_obj.yjsl
    bz.value = change_obj.bz
}
/* 确认修改，读取对应数据的其他内容，并组合修改新内容为新数据，修改数组对应数据，并重新渲染页面 */
function T_change_rk() {
    let flbh = allData[change_num].flbh
    let flmc = allData[change_num].flmc
    let flms = allData[change_num].flms
    let bz = document.getElementById('change_rk_4').value
    let kcbh = allData[change_num].kcbh
    let spmc = document.getElementById('change_rk_2').value
    let spfl = document.getElementById('change_rk_1').value
    let spsl = allData[change_num].spsl
    let bh = allData[change_num].bh
    let rksl = allData[change_num].rksl
    let rkrq = allData[change_num].rkrq
    let yjsl = document.getElementById('change_rk_3').value
    let cksl = allData[change_num].cksl
    let ckrq = allData[change_num].ckrq
    let yhm = allData[change_num].yhm
    let xm = allData[change_num].xm
    let xb = allData[change_num].xb
    let new_data = { flbh, flmc, flms, bz, kcbh, spmc, spfl, spsl, bh, rksl, rkrq, yjsl, cksl, ckrq, yhm, xm, xb }
    allData.splice(change_num, 1, new_data)
    show(now_page)
}
/* 动态渲染添加页面框内的，分类选项和商品选项 */
function showSelect_add(data) {
    $('#add_rk_1').html('')
    $('#add_rk_2').html('')
    for (let i = 0; i < data.length; i++) {
        $('#add_rk_1').append(
            `<option value="分类${i}">分类${i}</option>`
        )
        $('#add_rk_2').append(
            `<option value="商品${i}">商品${i}</option>`
        )
    }
}
/* 动态渲染修改模态框内的，分类选项和商品选项 */
function showSelect_change(data) {
    $('#change_rk_1').html('')
    $('#change_rk_2').html('')
    for (let i = 0; i < data.length; i++) {
        $('#change_rk_1').append(
            `<option value="分类${i}">分类${i}</option>`
        )
        $('#change_rk_2').append(
            `<option value="商品${i}">商品${i}</option>`
        )
    }
}
/* 导航函数，点击展开/收回导航菜单内容 */
function pullDown(obj) {
    let num = obj.siblings().length + 1
    if (h_judge) {
        obj.parent().css({
            'height': num * 40 + 'px'
        })
        obj.children().last().css({
            'transform': 'rotate(0deg)'
        })
    } else {
        obj.parent().css({
            'height': 40 + 'px'
        })
        obj.children().last().css({
            'transform': 'rotate(180deg)'
        })
    }
    h_judge = !h_judge
}
/* 导航函数，页面跳转设置 */
function jumpPage(obj) {
    switch (obj.attr('page-data')) {
        case 'page1':
            location.href = './flgl.html';
            break
        case 'page2':
            location.href = './kcgl.html';
            break
        case 'page3':
            location.href = './rkgl.html';
            break
        case 'page4':
            location.href = './yjxxsz.html';
            break
        case 'page5':
            location.href = './ckgl.html';
            break
        case 'page6':
            location.href = './yhgl.html';
            break
        case 'page7':
            location.href = './xgmm.html';
            break
    }
    let page
    sessionStorage.setItem('page', obj.attr('page-data'))
}